<template>
	<view>
		<view class="input_title">
			<view class="inputContent">
				<view class="btnRer">
					<view class="imgLeft">
						<image src="../static/searchA.png"></image>
					</view>
					<input v-model="inputConent" :placeholder="placeholder" />
				</view>
				<view class="imgRight" @click="goSearch">
					<image src="../../../static/image/rightA.png"></image>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
  name: "baseTab",
  props: {
    inputConent: {
      type: String,
      default: "label",
    },
	placeholder:{
		type: String,
		default: "label",
	}
  },
  data() {
    return {};
  },
  computed: {
   
  },
  methods: {
    goSearch() {
		this.$emit("search",);
    },
  },
};
</script>

<style lang="scss" scoped>
.input_title{
	width: 100%;
	height: 60rpx;
	line-height: 60rpx;
	margin-top: 25rpx;
	.inputContent{
		display: flex;
		// align-items: center;
		width: 100%;
		height: 100%;
		.btnRer{
			display: flex;
			align-items: center;
			width: 95%;
			height: 100%;
			border: 1px solid $main-color;
			border-radius: 25px;
			background-color: #fff;
			.imgLeft{
				text-align: center;
				width: 8%;
				image{
					width: 24rpx;
					height: 25rpx;
				}
			}
			input{
				width: 92%;
				height: 100%;
				font-size: 21rpx;
				color: #A6A6A6;
			}
		}
		.imgRight{
			width: 10%;
			text-align: center;
			margin-top: 8rpx;
			image{
				width: 47rpx;
				height: 47rpx;
			}
		}
	}
}
</style>
